import React, { useRef } from 'react'
import Home from './components/home/index'
import Foot from './components/foot/index'
import My from './components/my/index'
import Store from './components/store/index'
const App = React.forwardRef((props, ref) => {
  const HomeRef = useRef(null)
  const FootRef = useRef(null)
  const MyRef = useRef(null)
  const StoreRef = useRef(null)
  const getAllList = () => {
    setTimeout(() => {
      HomeRef.current.handleChildMethod()
      FootRef.current.handleChildMethod()
      MyRef.current.handleChildMethod()
      StoreRef.current.handleChildMethod()
    })
  }
  const handleChildMethod = () => {
    getAllList()
  }

  React.useImperativeHandle(ref, () => ({
    handleChildMethod
  }))
  return (
    <div>
      <Home ref={HomeRef} />
      <Foot ref={FootRef} />
      <My ref={MyRef} />
      <Store ref={StoreRef} />
    </div>
  )
})
export default App
